<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>朝闻天下前台</title>
    <include file="Public/head"/>
    <style>
        .hideThisSpan{display:none;}
    </style>
    <link href="__PUBLIC__/assets_h/stylesheets/datepicker.css" media="all" rel="stylesheet" type="text/css"/>
    <script src="__PUBLIC__/assets_h/javascripts/jquery.bootstrap.wizard.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/fullcalendar.min.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/jquery.dataTables.min.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/jquery.easy-pie-chart.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/jquery.isotope.min.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/jquery.fancybox.pack.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/select2.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/jquery.inputmask.min.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/jquery.validate.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/bootstrap-fileupload.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/bootstrap-datepicker.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/bootstrap-timepicker.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/daterange-picker.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/date.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/jquery.sparkline.min.js" type="text/javascript"></script>
    <script src="__PUBLIC__/assets_h/javascripts/main.js" type="text/javascript"></script>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">

</head>
<body class="no-skin" style="background-color: #e8f0f1">
<include file="Public/pheader"/>

<div id="wrap" style="margin-bottom: 60px;width: 100%">
    <div class="container-fluid">
        <div class="row col-md-12 col-md-offset-2 " style="margin-bottom: 5%">
            <h2 style="text-align: center;color: #56abe4; margin-bottom: 0px;padding-bottom: 0px;">
                <p class="" style="font-family: 楷体;font-weight:bold;margin-bottom: 10px;margin-top: 10px;font-size: 35px">朝闻天下论坛</p>
            </h2>
            <hr>
        </div>
        <!--<div class="row">-->
            <!--<div class="col-md-12">-->
                <!--<volist name="a" id="pm">-->
                <!--<marquee  loop="infinite" scrollamount="5" behavior="alternate"  direction="right" width="500" height="50" vspace="10" hspace="10" style="font-family: 楷体;font-size: 25px">-->
                    <!--&lt;!&ndash;{$pm["username"]}:&nbsp;{$pm["comment"]}&ndash;&gt;-->
                    <!--<img src="__PUBLIC__/images/pic/{$pm.pic}"  style="border-radius:50% ; width:50px;height: 50px;" alt="空">-->
                <!--</marquee>-->
            <!--</volist>-->
            <!--</div>-->
        <!--</div>-->

        <div class="row col-lg-10 col-md-10 col-sm-10 col-xs-10 col-md-offset-1 col-lg-offset-1 col-ms-offset-1 col-xs-offset-1" style="background-color: #f5f2fc;height: 100%;border: solid 1px;border-color: #e1dee8;border-radius: 5%;width: 1500px;margin-left: 10%;">
            <div class="col-lg-1 col-md-1 col-sm-1 col-xs-1" style="margin-top: 1%;margin-right: 2%;">
                <ul style="list-style-type: none;padding-left: 0px;padding-right: 70px;">
                    <volist name="list" id="val">
                        <li style="margin: 0px;padding: 0px"><img src="__PUBLIC__/images/pic/{$val.pic}" style="float: left;border-radius:30% ; width:80px;height: 80px;" alt="空"></li>
                        <li style="margin-bottom: 0px;padding-bottom: 0px;position: relative;text-align: center;font-family: 楷体;font-size: 20px;color: #ff8700">
                            <button type="button" class="btn btn-default" style="font-size: large;margin-bottom: 0px;padding-bottom: 0px;margin-top: 30%;width: 80px;height: 30px">楼主</button>
                        </li>
                        <a href="#">
                            <li style="margin-top: 0px;padding-top: 0px;position: relative;text-align: center;font-family: 楷体;font-size: 20px;color: #ff8700">{$val['username']}</li>
                        </a>
                    </volist>
                </ul>

            </div>
            <volist name="list" id="val">
                <div class=" col-lg-6 col-md-6 col-sm-6 col-xs-6 col-lg-offset-1 col-md-offset-1 col-xs-offset-1 col-ms-offset-1" style="margin-top: 1%;margin-bottom: 1%;border-radius: 5%;background-color: #ffffff;height: 100%">
                    <span class="hideThisSpan" style="text-align: center;font-family: 楷体;font-size: 20px">{$val['id']}.</span>
                    <p style="text-align: center;font-family: 楷体;font-size: 30px">{$val['title']}</p>
                    <p style="margin-left: 5%;font-family: 楷体;font-size: 20px">{$val['content']}</p>


                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2 col-lg-offset-1 col-md-offset-1 col-xs-offset-1 col-ms-offset-1" style="">

                    <h3 style="float: right;text-align: right;font-family: 楷体;color: #4ff3fc">喜欢就扫码下载吧</h3>
                    <img src="__PUBLIC__/images/ma.png" width="100" height="100" style="float: right">
                    <a class="modelshow" href="javascript:;" newId="{$val['id']}" >
           <span  style="margin-top: 55%;width: 50%;float: left;font-family: 楷体;font-size: larger">
           评论
           </span>
                    </a>

                </div>
            </volist>
            <script>
                $('.modelshow').click(function () {
                    var nid = $(this).attr('newId');
                    var ac = "{:U('Fourm/comment')}?id="+ nid;
                    var str = " <form action='" + ac + "' method='POST'>" +
                            "<div class='modal-body' style='padding-bottom:0px;background-color:white; '>" +
                            " <div class='container-fluid'>" +
                            "<div class='row' >" +
                            "<div class='col-md-8  col-xs-8 col-sm-8 col-sm-offset-2 col-md-offset-2 col-xs-offset-2' id='modalMessag'>" +
                            "<input type='text' name='comment' class='form-control ' style='margin: 0 auto'  placeholder='请输入评论' required>" +
                            "</div>" + "</div>" + "</div>" +
                            "<div class='modal-footer' style='margin-top: auto'>" + "<div class='container-fluid'>" +
                            " <div class='row' style='padding-top: 10px'>" + "<div class='col-md-8 col-xs-8 col-sm-8 col-sm-offset-2 col-md-offset-2 col-xs-offset-2'>"
                            + " <button type='submit' class='btn btn-primary btn-block' id='modalButton' >确&nbsp;定 </button>"
                            + "</div> </div> </div> </div> </div> </form>";
                    $('#inc').html(str);
                    $('#myModal').modal('show');

                })
            </script>

            <div class="modal fade bs-example-modal-sm" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
                 aria-hidden="true" style="margin-top: 8%">
                <div class="modal-dialog modal-sm" style="width: 40%">
                    <div class="modal-content" style="border-radius: 5px;">
                        <div class="modal-header"
                             style="padding-bottom:0px; border-bottom:0px;padding-left:0px;padding-right:0px;background-color: #ffffff">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="height:50px;">
                    <span class=""
                          style="height:50px;padding:10px 40px 10px 0px;background-image: url('__APP__/Public/assets_h/images/modal_close.png') ;background-size:100%;background-repeat: no-repeat"></span>
                            </button>
                            <div class="container-fluid">
                                <div class="row" style="margin-top: 5%">
                                    <div class="col-md-12  col-xs-12 col-sm-12 col-sm-offset-0 col-md-offset-0 col-xs-offset-0"
                                         style="margin-bottom: 0px">
                                        <div class="col-md-6 col-xs-6 col-sm-6  col-md-offset-3 col-sm-offset-3 col-xs-offset-3">

                                            <h2 style="text-align: center;margin-bottom: 0px ">评论条</h2>
                                        </div>

                                    </div>
                                </div>
                            </div>

                            <div id="inc">

                            </div>

                        </div>


                    </div>
                </div>
            </div>


        </div>


        <volist name="a" id="vo">
            <div class="row col-lg-10 col-md-10 col-sm-10 col-xs-10 col-md-offset-1 col-lg-offset-1 col-ms-offset-1 col-xs-offset-1" style="margin-left: 10%;width: 1500px;border-radius: 3%;background-color:#f5f2fc ;border: solid 1px #e1dee8 ;height: 100%">

                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2 col-lg-offset-1 col-md-offset-1 col-xs-offset-1 col-ms-offset-1" style="text-align: center;">

                    <span style="float: left;font-family: 楷体;font-size: 20px">{$vo['code']}楼</span>
                    <ul style="list-style-type: none;">
                        <li style="text-align: left">
                            <a class="usershow"  href="javascript:;"  frienduid="{$vo['uid']}"  olduname="{$vo['username']}"  qq="{$vo['qq']}" intro="{$vo['intro']}" portrait="{$vo.pic}">
                                <img src="__PUBLIC__/images/pic/{$vo.pic}"  style="border-radius:50% ; width:50px;height: 50px;" alt="空">
                            </a>
                        </li>
                        <script>
                            $('.usershow').click(function () {
                                var oldu = $(this).attr('olduname');
                                var Fuid = $(this).attr('frienduid');
                                var img  = $(this).attr('portrait');
                                var acc = "{:U('Fourm/addfriend')}?uid="+ Fuid;
                                var QQ = $(this).attr('qq');
                                var Intro = $(this).attr('intro');
                                var str = " <form  method='POST'>" +
                                        "<div class='modal-body' style='padding-bottom:0px;background-color:white; '>" +
                                        " <div class='container-fluid'>" +
                                        "<div class='row' >" +
                                        "<div class='col-md-11  col-xs-11 col-sm-11 col-sm-offset-3 col-md-offset-3 col-xs-offset-3' id='modalMessag'>" +
                                        "<img src='__PUBLIC__/images/pic/"+img+"' id='demo' style='border-radius: 50%;width: 15%;height: 100px;text-align: left;margin-right: 50%' >" +
                                        "<input type='text' name='qq' id='qq' class='form-control ' style='color: #4bffc1;width: 50%;text-align: center;font-family: 楷体;font-size: 25px;margin-top:3%'  placeholder='"+"QQ:"+QQ+"' >" +
                                        "<textarea class='form-control' type='text' name='intro' id='intro' rows='3' style='color: #4bffc1;width: 50%;text-align: center;font-family: 楷体;font-size: 25px;margin-top:3%' placeholder='"+"自我介绍:"+Intro+"' ></textarea>"+
                                        "<input type='text' name='name' id='name' class='form-control ' style='color: #4bffc1;width: 50%;text-align: center;font-family: 楷体;font-size: 25px;margin-top:3%'  placeholder='" +"用户名:" +oldu + "' >" +
                                        "<a href='" + acc + "'>"+"<img src='__PUBLIC__/images/addfriend.png' style='width: 50px;height: 50px;margin-right: 300px;margin-top: 30px'>"+"</a>"+
                                        "</div>" + "</div>" + "</div>" +
                                        "<div class='modal-footer' style='margin-top: auto'>" + "<div class='container-fluid'>" +
                                        " <div class='row' style='padding-top: 10px'>" + "<div class='col-md-8 col-xs-8 col-sm-8 col-sm-offset-2 col-md-offset-2 col-xs-offset-2'>"
                                        + "</div> </div> </div> </div> </div> </form>";
                                $('#incoc').html(str);
                                $('#display').modal('show');

                            })
                        </script>
                        <div class="modal fade bs-example-modal-sm" id="display" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
                             aria-hidden="true" style="margin-top: 8%">
                            <div class="modal-dialog modal-sm" style="width: 40%">
                                <div class="modal-content" style="border: solid 1px;border-radius: 10px;">
                                    <div class="modal-header"
                                         style="padding-bottom:0px; border-bottom:0px;padding-left:0px;padding-right:0px;background-color: #ffffff">
                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="height:50px;">
                    <span class=""
                          style="height:50px;padding:10px 40px 10px 0px;background-image: url('__APP__/Public/assets_h/images/modal_close.png') ;background-size:100%;background-repeat: no-repeat"></span>
                                        </button>
                                        <div class="container-fluid">
                                            <div class="row" style="margin-top: 5%">
                                                <div class="col-md-12  col-xs-12 col-sm-12 col-sm-offset-0 col-md-offset-0 col-xs-offset-0"
                                                     style="margin-bottom: 0px">
                                                    <div class="col-md-6 col-xs-6 col-sm-6  col-md-offset-3 col-sm-offset-3 col-xs-offset-3">
                                                        <h2 style="font-family: 楷体;font-size: 35px;color: #adb2a9;text-align: center;margin-bottom: 0px ">个人名片</h2>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div id="incoc">
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                        <li style="text-align: left;font-family: 楷体;font-size: 30px">
                            {$vo['username']}
                        </li>
                    </ul>

                </div>
                <div class="col-lg-5 col-md-5 col-sm-5 col-xs-5 col-lg-offset-0 col-md-offset-0 col-xs-offset-0 col-ms-offset-0" style="border: solid 1px;border-radius: 5%;background-color:#ffffff ;text-align: center;margin-top: 2%;" >
                    <span class="hideThisSpan" style="">{$vo['fid']}</span>
                    <p style="font-family: 楷体;font-size: 30px">
                        {$vo['comment']}
                    </p>

                     <div  class=" col-lg-6 col-md-6 col-sm-6 col-xs-6" style="margin-left: 0px;padding-left: 0px;background-color:#f5f2fc;border: solid 1px;border-radius: 10% ">
                         <ul  style="">
                         <li id="replycomment" style="display: none"></li>
                         </ul>
                   </div>
                </div>
                <div class="col-md-2 col-md-2 col-sm-2 col-xs-2 col-lg-offset-0 col-md-offset-0 col-xs-offset-0 col-ms-offset-0" style="text-align: center;">
                    <a class="modalshow" href="javascript:;" fourmId="{$vo['fid']} " olduname="{$vo['username']}">
           <span  style="margin-top: 55%;width: 50%;float: left;font-family: 楷体;font-size: larger">
           回复
           </span>
                    </a>
                </div>

            </div>
        </volist>
        <script>
            $('.modalshow').click(function () {
                var fid = $(this).attr('fourmId');
                var oldu = $(this).attr('olduname');
                var str = " <form  method='POST' >" +
                        "<div class='modal-body' style='padding-bottom:0px;background-color:white; '>" +
                        " <div class='container-fluid'>" +
                        "<div class='row' >" +
                        "<div class='col-md-8  col-xs-8 col-sm-8 col-sm-offset-2 col-md-offset-2 col-xs-offset-2' id='modalMessag'>" +
                        "<input type='hidden' name='fid' id='fid' class='form-control ' style='font-family: 楷体;font-size: 25px;margin: 0 auto'  placeholder='"+fid+"' value='" + fid + "'>" +
                        "<input type='text' name='reply' id='reply' class='form-control ' style='font-family: 楷体;font-size: 25px;margin: 0 auto'  placeholder='" +"回复&nbsp;" +oldu + "' required>" +
                        "</div>" + "</div>" + "</div>" +
                        "<div class='modal-footer' style='margin-top: auto'>" + "<div class='container-fluid'>" +
                        " <div class='row' style='padding-top: 10px'>" + "<div class='col-md-8 col-xs-8 col-sm-8 col-sm-offset-2 col-md-offset-2 col-xs-offset-2'>"
                        + " <button type='submit' class='btn btn-primary btn-block' id='submit' >确&nbsp;定 </button>"
                        + "</div> </div> </div> </div> </div> </form>";
                $('#inco').html(str);
                $('#replay').modal('show');

                $("#submit").click(function () {
                    toAjax();

                })


            })
        </script>


        <div class="modal fade bs-example-modal-sm" id="replay" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
             aria-hidden="true" style="margin-top: 8%">
            <div class="modal-dialog modal-sm" style="width: 40%">
                <div class="modal-content" style="border-radius: 5px;">
                    <div class="modal-header"
                         style="padding-bottom:0px; border-bottom:0px;padding-left:0px;padding-right:0px;background-color: #ffffff">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="height:50px;">
                    <span class=""
                          style="height:50px;padding:10px 40px 10px 0px;background-image: url('__APP__/Public/assets_h/images/modal_close.png') ;background-size:100%;background-repeat: no-repeat"></span>
                        </button>
                        <div class="container-fluid">
                            <div class="row" style="margin-top: 5%">
                                <div class="col-md-12  col-xs-12 col-sm-12 col-sm-offset-0 col-md-offset-0 col-xs-offset-0"
                                     style="margin-bottom: 0px">
                                    <div class="col-md-6 col-xs-6 col-sm-6  col-md-offset-3 col-sm-offset-3 col-xs-offset-3">
                                        <h2 style="text-align: center;margin-bottom: 0px ">回复条</h2>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div id="inco">
                        </div>
                    </div>
                </div>
            </div>
        </div>


        <div class="row">
            <div class="col-md-5"></div>
            <div class="col-md-4">
                <a href="{:U('Fourm/index')}" >
                    <img src="__PUBLIC__/images/back.png" width="40" height="40" style="text-align: center;margin-top: 5%">
                </a>
            </div>
<div class="col-md-1">
    <a onclick="pageScroll()">
        <img src="__PUBLIC__/images/gotop.png" width="40" height="40" style="text-align: center;margin-top: 15%">
    </a>
    <script>
        function pageScroll(){
            window.scrollBy(0,-100);
            scrolldelay = setTimeout('pageScroll()',100);
            var sTop=document.documentElement.scrollTop+document.body.scrollTop;
            if(sTop==0) clearTimeout(scrolldelay);
        }
    </script>
</div>
        </div>

    </div>
</div>

<script>
    function toAjax() {
        var fid = $("#fid").val();
        var reply= $("#reply").val();

        $.ajax({
            url: "{:U('Fourm/reply')}",
            data:{"fid":fid,"reply":reply},
            type:'post',
            dataType:'json',
            success:function(result) {
                var json = result;
                var length = json.length;
                var li=" ";
                for(var i=0;i<length;i++){
                    li+='<li>json.i["username"] + ":" + json.i["reply"]</li>';
                }
                $("#replycomment").html(li);
            }

        })

    }
</script>
</body>
</html>

